<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>背景裁剪区域</title>
        <style>
           div{
            border:10px dotted #000;
            width:200px;
            padding:20px;
            background-color: yellow;
           }
           .size2{
            background-clip: padding-box;
           }
           .size3{
            background-clip: content-box;
           }
        </style>
    </head>
    <body>
        <div class="size1"></div>
        <div class="size2"></div>
        <div class="size3">内容</div>
    </body>
</html>